import { type FC } from 'react';
import { Text, TouchableHighlight } from 'react-native';
import type { ButtonProps } from '../../types';
import styles from './styles';

const Button: FC<ButtonProps> = (props) => {
  const { type } = props;

  const textStyles = [
    styles.buttonText,
    type === 'danger' && styles.dangerText
  ];

  return (
    <TouchableHighlight
      style={styles.button}
      underlayColor="#f8f8f8"
      onPress={props.onPress}
    >
      <Text style={textStyles}>
        {props.title}
      </Text>
    </TouchableHighlight>
  );
}

export default Button;